<template>
	<view class="">
		<view class="content" v-for="(item,index) in data.list" :key="index">
			<view class="vip-box">
				<view class="cd-name">{{item.siteName}}</view>
				<view class="flex-align-center info">
					<img src="../../../static/img/img/fx-time.png" class="fx-time" alt="">
					<text class="text">营业 {{item.businessTimeStart}}-{{item.businessTimeEnd}}</text>
				</view>
				<view class="flex-align-center info">
					<img src="../../../static/img/img/fx-dingwei.png" class="fx-time" alt="">
					<text class="text">{{item.address}}</text>
				</view>
			</view>
			<view class="vip-card">
				<vipCard type="use" v-for="(ite,idx) in item.tmemberUserList" :item="ite" :key="idx"></vipCard>
			</view>
		</view>
		<view class="no-data">
			<uv-load-more fontSize="12" v-if="data.isComplete" status="nomore" />
		</view>
	</view>
</template>

<script setup>
	import vipCard from "@/compoments/vip/vipCard.vue";
	import {
		ref
	} from 'vue';
	import {
		onLoad,
		onReachBottom
	} from '@dcloudio/uni-app';
	import {
		echoMemberList
	} from '../../requestApi/api.js';
	const data = ref({
		list: [],
		current: 1,
		size: 10,
		isLoading: false,
		isComplete: false,
	})
	onLoad(() => {
		getList();
	});

	const getList = () => {
		data.value.isLoading = true;
		echoMemberList({
			current: data.value.current,
			size: data.value.size,
		}).then(res => {
			data.value.isLoading = false;
			data.value.list = data.value.list.concat(res.data.records);
			data.value.current++;
			data.value.isComplete = !res.data.records.length;
		})
	};
	onReachBottom(() => {
		!data.value.isLoading && !data.value.isComplete && getList();
	})
</script>

<style lang="scss">
	.content {
		padding: 42rpx;

		.vip-box {
			padding-bottom: 20rpx;
			border-bottom: 2rpx solid #F2F2F2;
			margin-bottom: 38rpx;

			.cd-name {
				font-size: 36rpx;
				font-weight: bold;
				color: #2C2C2C;
				margin-bottom: 18rpx;
			}

			.info {
				margin-bottom: 10rpx;

				.fx-time {
					width: 20rpx;
					height: 20rpx;
					margin-right: 20rpx;
				}

				.text {
					font-size: 20rpx;
					color: #A5A5A5;
				}
			}
		}

		.vip-card {
			padding: 0 10rpx;
		}

	}
</style>